const stats = new Stats()
stats.showPanel(0)
document.body.appendChild(stats.dom)

function Snake() {
    this.headColor = floor(random(100))
    this.x = innerWidth / 2
    this.y = innerHeight / 2
    this.snakeParts = [{ x: this.x, y: this.y }]
    this.d = 1
    this.direction = 'up'//up down left right
    this.size = 20
    this.draw = function () {
        fill(this.headColor)
        this.snakeParts.forEach(item=>{
            circle(item.x, item.y, this.size)
        })
    }
    this.update = function () {
        if(this)
    }
}


const snake = new Snake()

function keyPressed() {
    if (keyCode === UP_ARROW) {
        snake.direction = 'up'
    } else if (keyCode === DOWN_ARROW) {
        snake.direction = 'down'
    } else if (keyCode === LEFT_ARROW) {
        snake.direction = 'left'
    } else if (keyCode === RIGHT_ARROW) {
        snake.direction = 'right'
    }
}

function setup() {
    createCanvas(innerWidth, innerHeight)
    noStroke()
    frameRate(60)
    colorMode(HSB, 100)
    background(0)
    initBalls()
}

function draw() {
    stats.begin()
    stats.end()
}
